<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <script text="javascript">
        function recargar() {
            //se activa el método alert luego de 2 segundos
            //setTimeout("alert('Pasaron 2 segundos!')",2000); 10000
            setTimeout('document.location.reload()', 1000);
        }

    </script> 

    <ui:composition template="/templateuser.xhtml">
        <ui:define name="body">
            <p:growl id="growl" showDetail="true"/>

            <h:form id="frmDeriva" >
                <h:panelGroup id="messagePanel" layout="block">
                    <!--h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/-->
                </h:panelGroup> 
                <p:panel header=" Seguimiento de Expediente"  >
                    <h:panelGrid id="pnl1" columns="3" cellpadding="4" cellspacing="4" style="margin: 1 auto; border: blue"  > 
                        <h:outputLabel value="N° de Expediente a Consultar " style="color: blue;" /> 
                        <h:inputText value="#{movExpController.idregistro}" size="12"   />
                        <p:commandButton value="Listar Derivaciones del Expediente " icon="ui-icon-search" action="#{movExpController.filtrar_nRegistro}" 
                                         update="frmDeriva"/>
                    </h:panelGrid>
                    <h:panelGroup >
                        <p:dataTable value="#{movExpController.lista}" var="item" resizableColumns="true" widgetVar="expTable"  paginator="true"
                                     rowKey="#{item.idMovExp}" selection="#{movExpController.movexp}" selectionMode="single" id="dataTable" >
                            <f:facet name="header" >  
                                Movimiento &nbsp;de &nbsp;Derivaciones &nbsp;del &nbsp;Registro &nbsp;&nbsp;Nº  &nbsp;&nbsp; 
                                <h:outputText value="#{movExpController.idregistro}" style="text-align: center; font-size: 14px; " />
                            </f:facet>  
                            <p:column width="65" style="text-align: center; font-size: 11px; ">
                                <f:facet name="header"><h:outputText value="N° Registro"/></f:facet>
                                <h:outputText value="#{item.expediente}"/>
                            </p:column>
                            <p:column width="85" style="text-align: left; font-size: 11px; color: red">
                                <f:facet name="header"><h:outputText value="Fecha/Hora Derivac"/></f:facet>
                                <h:outputText value="#{item.fecha}" style="margin: 0 auto;">
                                    <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" />
                                </h:outputText>
                            </p:column> 
                            <p:column width="105" style="text-align: left; font-size: 11px">
                                <f:facet name="header"><h:outputText value="Area Remitente"/></f:facet>
                                <h:outputText value="#{item.area1.nombre}"/>
                            </p:column>
                            <p:column width="105" style="text-align: left; font-size: 11px">
                                <f:facet name="header"><h:outputText value="Area Derivada"/></f:facet>
                                <h:outputText value="#{item.area.nombre}"/>
                            </p:column> 
                            <p:column width="50" style="text-align: left; font-size: 11px"> 
                                <f:facet name="header"><h:outputText value="Doc.Derivado"/></f:facet>
                                <h:outputText value="#{item.tipoDocInterno.nombre}"/>
                            </p:column>
                            <p:column width="32" style="text-align: center; font-size: 11px">
                                <f:facet name="header"><h:outputText value="N°Docum"/></f:facet>
                                <h:outputText value="#{item.numdocEmitido}"/>
                            </p:column>
                            <p:column width="22" style="text-align: center; font-size: 11px">
                                <f:facet name="header"><h:outputText value="Folios"/></f:facet>
                                <h:outputText value="#{item.folios}"/>
                            </p:column>

                            <p:column width="200" style="text-align: left; font-size: 11px">
                                <f:facet name="header"><h:outputText value="Asunto"/></f:facet>
                                <h:outputText value="#{item.asunto}"/>
                            </p:column>

                            <p:column width="70" style="text-align: left; font-size: 11px">
                                <f:facet name="header"> <h:outputText value="Resp.Derivación"/> </f:facet>
                                <h:outputText value="#{item.trabajador.apePat.trim()} #{item.trabajador.nombres.trim()}"/>
                            </p:column>
                            <p:column width="50" style="text-align: left; font-size: 11px">
                                <f:facet name="header"><h:outputText value="Acciones"/></f:facet>
                                <h:outputText value="#{item.observacion}"/>
                            </p:column>

                            <p:column width="182" style="text-align: left; font-size: 11px">
                                <f:facet name="header">
                                    <h:outputText value="Opciones"/>
                                </f:facet>
                                <p:commandButton value="Ver" icon="ui-icon-search" oncomplete="expSelecDialog.show()" update=":frmDetalle" title="Seleccionar Registro y luego click en opcion VER "   />
                                <p:commandButton value="Editar" icon="ui-icon-arrowrefresh-1-w" disabled="true"   /> 
                                <p:commandButton value="Elimina" icon="ui-icon-close" disabled="true"/>
                            </p:column>

                            <f:facet name="footer">  
                                <p:commandButton value="Nueva Derivación" icon="ui-icon-disk" disabled="true">
                                </p:commandButton>

                                &nbsp; &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp; &nbsp;  
                                <h:commandButton actionListener="#{movExpController.reg_DerivaPrnw}" title="Reporta Derivaciones del Registro" image="/resources/img/print.PNG" value="Derivaciones"/>

                            </f:facet>  

                        </p:dataTable>
                    </h:panelGroup>
                    <br/>
                    <br/>
                    <br/>
                </p:panel> 
                <br />
            </h:form>
            <h:form id="frmDetalle" >  
                <p:dialog header=" Detalle de la Derivación Seleccionada" closeOnEscape="true" widgetVar="expSelecDialog" resizable="false" width="680"  
                          showEffect="fade" hideEffect="explode" >
                    <h:panelGrid id="display" columns="2" cellpadding="4"  style="font-size: 11px;" >
                        <h:outputText value="Nº Registro" style="font-size: 13px; color: red;" />
                        <h:outputText value="#{movExpController.movexp.expediente.codExp}" style="font-size: 18px; font-weight: 700; color: red;" />
                        <h:outputText value="Fecha y Hora" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.fecha}" style="color: blue;width: 115px;" readonly="true">
                            <f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
                        </p:inputText>
                        <h:outputText value="Area que Remite" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.area.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Area Remitida" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.area1.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Tipo Doc.Remitido" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.tipoDocInterno.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="N°Docum. Remitido" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.numdocEmitido}" style="color: blue;width: 140px;" readonly="true"/>
                        <h:outputText value="N°  de  Folios" style="font-size: 11px;" />
                        <p:inputText value="#{movExpController.movexp.folios}" style="color: blue;width: 60px;" readonly="true"/>
                        <h:outputText value="Asunto" style="font-size: 11px;" />
                        <p:inputTextarea value="#{movExpController.movexp.asunto}" rows="4" style="color: blue; width: 510px;" cols="65" readonly="true"/>
                        <h:outputText value="Respons.Derivación" style="font-size: 11px;" /> 
                        <p:inputText value="#{movExpController.movexp.trabajador.apePat.trim()}, #{movExpController.movexp.trabajador.nombres.trim()}" style="color: blue; width: 220px;" readonly="true" />
                        <h:outputText value="Observación" style="font-size: 11px;" />
                        <p:inputTextarea value="#{movExpController.movexp.observacion}" rows="3" style="color: blue; width: 510px;" cols="65" readonly="true"/>
                    </h:panelGrid>
                </p:dialog>
            </h:form> 
        </ui:define>
    </ui:composition>

</html>
